<?php
	require_once 'config.php';
	session_start();
	
	if (isset($_SESSION['access_token']))	{
		$access_token = $_SESSION['access_token'];
	}
?>

<html>
<head>
	<title>Idee</title>
	<script type='text/javascript' src="<?php echo $host ?>/js/jquery-1.4.2.min.js"></script>
	<script type="text/javascript" src="<?php echo $host ?>/js/jquery-ui.min.js"></script>
	<script type="text/javascript" src="<?php echo $host ?>/js/jquery.rotate.1-1.js"></script>
	<script type="text/javascript" src="<?php echo $host ?>/js/jquery.json-2.2.js"></script>
	<script type="text/javascript" src="<?php echo $host ?>/js/inherit.js"></script>

	<script type="text/javascript" src="<?php echo $host ?>/js/config.js"></script>
	<script type="text/javascript" src="<?php echo $host ?>/js/utils.js"></script>		
	<script type="text/javascript" src="<?php echo $host ?>/js/event.js"></script>
	<script type="text/javascript" src="<?php echo $host ?>/js/utils.js"></script>
	<script type="text/javascript" src="<?php echo $host ?>/js/base.js"></script>	
	<script type="text/javascript" src="<?php echo $host ?>/js/tools.js"></script>
	
	<link rel="stylesheet" href="<?php echo $host ?>/css/main.css" type="text/css" />
	<link media="screen" href="css/web.css" rel="stylesheet" />
</head>
<body>

<div id='wrapper'>
		<div id='top'>
			<div id="top-nav">
				<div id="logo"><a class="logo" href="index.php"><img class="logo" src="images/logo.png" /></a></div>
				<div id='top-nav-items'>
					<ul class='ul-top'>
						<li><a onclick="shareFb()"><img src="http://static.ak.fbcdn.net/images/connect_favicon.png" /></a></li>
						<li id='toogleToolBox'>Tools<img style='width:10px;height:10px' src='images/arrow_down.png'/></li>
					</ul>
				</div>
			</div>
		</div>
		<div id='middle'>
			<div id='pdf'>	
				<link rel="stylesheet" href="<?php echo $host ?>/css/main.css" type="text/css" />
				<div class="board" id='main' style='width:907px, height:645px'>
				</div>
			</div>
		</div>
		<div class='clear'></div>
		<div id='bottom'>Copyright by @idee</div>
	</div>


	
	<script type="text/javascript">
		access_token="<?php echo $access_token?>";
		
		function shareFb()	{
			if (access_token == "")	{
				url = "https://graph.facebook.com/oauth/authorize?client_id=<?php echo GlobalConfig::$appId?>&redirect_uri=<?php echo GlobalConfig::$oauth_redirect?>";
				newwindow=window.open(url, 'photosharing', 'height=500,width=650');
				newwindow.onunload = function()	{
					window.onPopupClosed();
				};

				window.onPopupClosed = function() {
					access_token="<?php echo $access_token?>";
					shareFbWithAT();
				};
				if (window.focus) {
					newwindow.focus();
				}
			} else {
				shareFbWithAT();
			}
		}

		function shareFbWithAT()	{
			var cf = new Config();
			$.post(cf.getImageServiceUrl()+'index.php',
					{'html': $('#pdf').html(), 'mode': 'share'},
					function(ret)	{
						alert("result: "+ret);
					}
				);
		}
	</script>
	
	

	<form id='_toimg' name='_toimg' method="POST" action="<?php echo $imgServiceUrl?>/index.php">
		<span style='position:absolute; top:10px; left:10px'>
			File name: <input id='filenametext' style='width:80px' type='text' name='filename' value='ijdiagram' />
		</span>
		<input id='htmltext' type='hidden' name='html'/>
	</form>
	
	
	<div id='test' style='position:fixed; top:100px; left:100px'></div>
	
	<script language='javascript'>
		function topdf(){
			if($("#htmltext").val()==""){
				filename = 'default';
			}else{
				filename = $("#htmltext").val();
			}
			html_str = $('#pdf').html();
			$("#htmltext").val(html_str);
			$("#filenametext").val(filename);
			$("#_topdf").submit();
		}

		function toimg(){
			html_str = $('#pdf').html();
			$("#htmltext").val(html_str);
			$("#_toimg").submit();
		}
		/*
		$(document).ready(function(){
			startDrag('#tool');
		});
		

		function startDrag(id){
			$(id).bind('mousedown',function(){
				$(this).draggable();
			});
		}
		*/
	</script>
	
	<script type="text/javascript">
		app = new Application();
		app.begin();
		app.getToolBox().access().toggle();
		$(document).ready(function(){
			$("#toogleToolBox").click(function(){
				app.getToolBox().access().toggle();
			});
			//$(document).bind('mousedown',domMousedown);
			/*
			* this event make all input box stop working 
			*/ 
		});
		
		function domMousedown(e,obj){
			e.preventDefault();
		}
	</script>
</body>
</html>